<template>
  <el-menu
    class="el-menu-demo"
    mode="horizontal"
    background-color="#2c3e50"
    text-color="#ecf0f1"
    active-text-color="#3498db"
  >
    <el-menu-item index="1"><router-link to="/dashboard">数据看板</router-link></el-menu-item>
    <el-menu-item index="2"><router-link to="/ai-housing">Ai选房</router-link></el-menu-item>
    <el-menu-item index="3"><router-link to="/area-housing">区域找房</router-link></el-menu-item>
    <el-menu-item index="4"><router-link to="/map-housing">地图找房</router-link></el-menu-item>
    <el-menu-item index="5"><router-link to="/rent-out">我要出租</router-link></el-menu-item>
    <el-menu-item index="6"><router-link to="/open-store">我要开店</router-link></el-menu-item>
  </el-menu>
</template>

<script setup>
import 'element-plus/theme-chalk/el-menu.css'
import 'element-plus/theme-chalk/el-menu-item.css'
</script>

<style scoped>
/* 设置导航栏样式 */
.el-menu-demo {
  padding: 0 1rem; /* 设置左右内边距 */
  display: flex; /* 设置为flex布局 */
  justify-content: center; /* 将内容居中 */
}
/* 设置导航栏项中的链接样式 */
.el-menu-demo .el-menu-item a {
  font-size: 1.5rem; /* 增大字体 */
  text-decoration: none; /* 移除下划线 */
  margin: 0 2rem; /* 设置左右外边距 */
}
</style> 